import styled from 'styled-components'
import { thomeColor } from 'assets/color'

import border from 'utils/border'

export const HomeNavStyle =  styled.div`
    width:100%;
    height:.45rem;
    overflow: hidden;
`





export const HomeNavUlStyle = border ({
    component: styled.ul`
    width: 415px;
    height:.44rem;
    display:flex;
    align-items: center;
    justify-content: center;
    justify-content: space-around;
    font-size:14px
`,
    width: '0 0 1px 0',
    style: 'solid',
    color: '#eee',
    radius: 0,
})



export const HomeNavLiStyle = styled.li`

    a{
        height:.43rem;
        line-height:.45rem
    }

    .active{
        border-bottom: 2px solid  ${thomeColor};
        display:block;
       
        color:${thomeColor};
       
    }

`